<template>
  <view class="bg-white">
      <view class="h-40 flex flex-col justify-center items-center ">
        <view class="text-lg">-{{ detailInfo.extract_price }}</view>
        <view class="text-xs">余额: {{ detailInfo.balance }}</view>
      </view>
      <view class="px-4">
        <view class="pb-4 border-bottom">
          <view class="flex justify-between pb-4">
            <view class="text-slate-600">提现类型</view>
            <view class="text-slate-600">{{ detailInfo.extract_type == 'alipay' ? '支付宝': '银行卡' }}</view>
          </view>

          <view class="flex justify-between pb-4" v-if=" detailInfo.extract_type == 'alipay' ">
            <view class="text-slate-600">支付宝卡号</view>
            <view class="text-slate-600">{{ detailInfo.alipay_code }}</view>
          </view>

          <view v-else>
            <view class="flex justify-between pb-4">
              <view class="text-slate-600">银行卡号</view>
              <view class="text-slate-600">{{ detailInfo.bank_code }}</view>
            </view>

            <view class="flex justify-between pb-4">
              <view class="text-slate-600">银行卡地址</view>
              <view class="text-slate-600">{{ detailInfo.bank_address }}</view>
            </view>
          </view>

          <view class="flex justify-between pb-4">
            <view class="text-slate-600">处理进度</view>
            <view class="text-slate-600">
              <text v-if="detailInfo.status == '-1'">未通过</text>
              <text v-if="detailInfo.status == '0'">提现中</text>
              <text v-if="detailInfo.status == '1'">已提现</text>
            </view>
          </view>

          <view class="" v-if="detailInfo.status == '-1'">
            <view class="text-slate-600">未通过原因</view>
            <view class="text-slate-600 text-xs mt-2 indent-4">{{ detailInfo.fail_msg }}</view>
          </view>

        </view>

        <view class="pb-4">
            <view class="flex justify-between mt-5">
              <view class="text-slate-600">用户昵称</view>
              <view class="text-slate-600">{{ detailInfo.real_name }}</view>
            </view>

            <!--<view class="flex justify-between mt-5">-->
            <!--  <view class="text-slate-600">实到金额</view>-->
            <!--  <view class="text-slate-600">{{ detailInfo.receive_price }}</view>-->
            <!--</view>-->


          <!--<view class="flex justify-between mt-5">-->
          <!--  <view class="text-slate-600">用户ID</view>-->
          <!--  <view class="text-slate-600">{{ detailInfo.id }}</view>-->
          <!--</view>-->

          <view v-if="detailInfo.status == 1">
            <view class="flex justify-between mt-5">
              <view class="text-slate-600">手续费</view>
              <view class="text-slate-600">{{ detailInfo.service_fee }}</view>
            </view>

            <view class="flex justify-between mt-5">
              <view class="text-slate-600">实际到账</view>
              <view class="text-slate-600">{{ detailInfo.receive_price }}</view>
            </view>
          </view>



          <view class="flex justify-between mt-5">
            <view class="text-slate-600">提现时间</view>
            <view class="text-slate-600">{{ detailInfo.add_time }}</view>
          </view>


        </view>
      </view>

  </view>
</template>

<script setup lang="ts">
    import { ref } from 'vue'
    import { cashInfoApi } from '@/api/withdraw'
    import { onLoad } from '@dcloudio/uni-app'

    onLoad((options) => {
      getInfo(options?.id)
    })

    /** 提现详情 **/
    const detailInfo = ref<any>({})
    const getInfo = async(id) => {
      const res = await cashInfoApi(id)
      detailInfo.value = res.data
    }
</script>

<style scoped lang="scss">
page {
  background: #f5f5f5;
}
</style>
